<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>职称设置</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <!--引入本地的css样式-->
    <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../static/css/admin.css" media="all">

</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto" style="border-radius: 0;border-top: 4px solid #d2d2d2;">
            <!--多条件查询-->
            <div class="layui-form-item">
                <!--请输入职称名称： job_title_name-->
                <div class="layui-inline">
                    <label class="layui-form-label">职称名称</label>
                    <div class="layui-input-inline">
                        <input type="text" id="job_title_name" name="job_title_name" placeholder="请输入职称名称" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <!--请输入所属部门 dept_name-->
                <div class="layui-inline">
                    <label class="layui-form-label">所属部门</label>
                    <div class="layui-input-inline">
                        <select name="dept_name" id="dept_name">
                            <option value=""></option>
                        </select>
                    </div>
                </div>
                <!--请输入是否启用 status-->
                <div class="layui-inline">
                    <label class="layui-form-label">是否启用</label>
                    <div class="layui-input-inline">
                        <select name="status" id="status">
                            <option value="">--请选择--</option>
                            <option value="0">否</option>
                            <option value="1">是</option>
                        </select>
                    </div>
                </div>
                <!--查询-->
                <div class="layui-inline">
                    <button class="layui-btn layuiadmin-btn-useradmin" lay-submit lay-filter="LAY-emp-front-search" id="btn_search">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                    </button>
                </div>
            </div>
        </div>

        <div class="layui-card-body">
            <!-- 新增用户-->
            <!--头部工具栏 id="toolbarDemo" lay-event="事件名"-->
            <script type="text/html" id="toolbarDemo">
                <div class="layui-btn-container">
                    <button class="layui-btn layuiadmin-btn-admin" lay-event="add_house">
                        新增职称
                    </button>
                </div>
            </script>

            <!--table表-->
            <table id="LAY-user-manage" lay-filter="LAY-user-manage"></table>
            <!--侧边工具栏-->
            <script type="text/html" id="barDemo">
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit">修改</i></a>
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="query"><i class="layui-icon layui-icon-query">明细</i></a>
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete">删除</i></a>
            </script>

        </div>
    </div>
</div>

<script src="../../static/js/jquery-3.6.0.min.js"></script>
<!--引入本地layui.js-->
<script src="../../static/layui/layui.js"></script>
<!--js-->
<script type="text/javascript">
    layui.config({
        base: '../../static/layui/layuiadmin/' //静态资源所在路径js
    }).extend({
        index: 'lib/index' //主入口模块
    }).use('index');
</script>

<script type="text/javascript">
    layui.use(['table','form','jquery'],function (){
        var table = layui.table;
        var form = layui.form;


        //页面渲染时，添加所属部门的下拉列表选项
        $(document).ready(function(){
            console.log("-------------")
            //通过Ajax异步请求-下拉列表选项
            $.ajax({
                url:"/system/selectAllDeptname",
                type:"post",
                data:{},
                dataType:"json",
                success:function (res){
                    console.log("res.data------")
                    console.log(res.data)
                    datas=res;
                    console.log("datas.data------")
                    console.log(datas.data);
                    if(res.code==200){

                        let selectElement=document.getElementById("dept_name");
                        let  options = res.data

                        for(let i=0;i<res.data.length;i++){
                            let optionElement = document.createElement("option");
                            optionElement.text=res.data[i].dept_name;
                            optionElement.value=res.data[i].dept_name;
                            selectElement.add(optionElement);
                            console.log(selectElement);
                        }
                        form.render();

                    }else{

                    }

                },error:function (res){

                }
            })
        })

        //搜索点击事件
        $("#btn_search").click(function (){
            //职称名称
            var job_title_name = $("#job_title_name").val();
            console.log("job_title_name="+job_title_name)
            //所属部门
            var dept_name = $("#dept_name").val();
            console.log("dept_name="+dept_name)
            //是否启用
            var status = $("#status").val();
            console.log("status="+status)
            //表格重载
            //http://localhost:8080/system/selectJobtitleByNameDepartmentStatus
            table.reload('LAY-user-manage',{
                url:'/system/selectJobtitleByNameDepartmentStatus',
                page:{
                    curr:1 //重新从第一页刷新
                }
                ,where:{
                    job_title_name:job_title_name,
                    dept_name:dept_name,
                    status:status
                }
            })
        });
        //http://localhost:8080/system/selectJobtitleAll ,hide : true
        table.render({
            elem: '#LAY-user-manage'
            ,url:'/system/selectJobtitleAll'
            ,title: '职称数据表'
            ,toolbar:'#toolbarDemo'
            ,cols: [[
                // {type: 'checkbox', fixed: 'left'},
                {field:'job_title_id', title:'职称编码', fixed: 'left', unresize: true, sort: true}
                ,{field:'job_title_name', title:'职称名称'}
                ,{field:'dept_name', title:'所属部门'}
                ,{field:'status', title:'是否启用'}
                ,{field:'description', title:'职称描述',hide : true}
                ,{field:'remark', title:'备注',hide : true}
                ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:230}
            ]]
            ,page: true
            ,limits:[5,10,15,20]
        });
        //监听侧边工具栏事件
        table.on('tool(LAY-user-manage)',function (obj){
            console.log(1111111111)
            //获取选中行数据
            var data = obj.data;
            console.log(data.user_id)
            //删除
            if(obj.event === 'del'){//删除
                layer.confirm('确认要删除吗？',function (index){
                    //通过Ajax异步请求-假删
                    // http://localhost:8080/system/deleteJobtitleById
                    $.ajax({
                        url:"/system/deleteJobtitleById",
                        type:"post",
                        data:{id:data.job_title_id},
                        dataType:"json",
                        success:function (res){
                            layer.alert(res.msg);
                            //页面真删
                            obj.del();
                            layer.close(index);
                        },error:function (res){
                            layer.alert(res.msg);
                            layer.close(index);
                        }
                    })
                })
            }
            //编辑
            else if(obj.event === 'edit'){
                layer.open({
                    type:2,
                    title:"编辑职称信息",
                    content:'professional/edit.html',
                    area:['550px','650px'],
                    maxmin:true,
                    btn:['确定','取消'],
                    success: function (layero,index){
                        var body = layer.getChildFrame("body", index);
                        var contentWindow = layero.find('iframe')[0].contentWindow;//得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                        // body.find("label[name=user_id]").innerText(data.user_id);
                        body.find("input[name=job_title_id]").val(data.job_title_id);
                        body.find("input[name=job_title_name]").val(data.job_title_name);
                        body.find("textarea[name=description]").val(data.description);
                        body.find("textarea[name=remark]").val(data.remark);
                        body.find("input[name=status][value="+data.status+"]").attr("checked","checked");

                        // 获取角色值
                        var selectedDeptname = data.dept_name;
                        // 设置下拉列表选中项
                        var roleSelect2 = body.find("select[name=dept_name]");
                        roleSelect2.val(selectedDeptname);
                        contentWindow.layui.form.render();

                    },
                    yes:function (index, layero){
                        //获取edit.html-父list.html子edit.html-form表单
                        var body = layer.getChildFrame('body',index);
                        //获取表单的所有数据
                        var submitData = body.find('#myform').serialize();
                        console.log("打印表单数据-----"+submitData);
                        //发起Ajax异步请求
                        //http://localhost:8080/system/updateJobtitleById
                        $.ajax({
                            url:"/system/updateJobtitleById",
                            type:"post",
                            data:submitData,
                            dataType: "json",
                            success:function (res){
                                console.log(res)
                                if(res.code==200){
                                    layer.msg(res.msg,{
                                        offset:"15px",
                                        icon:1,
                                        time:1000
                                    },function (){
                                        //刷新
                                        window.location.reload();
                                    })
                                }
                                if(res.code==500){
                                    layer.msg(res.msg,{
                                        offset:"15px",
                                        icon:1,
                                        time:1000
                                    },function (){
                                        //刷新
                                        window.location.reload();
                                    })
                                }
                                //关闭弹层
                                layer.close(index);
                            }
                        })
                    }
                })
            }
            else if(obj.event === 'query'){
                layer.open({
                    type:2,
                    title:"职称详情信息",
                    content:'professional/detail.html',
                    area:['550px','650px'],
                    maxmin:true,
                    btn:['确定','取消'],
                    success: function (layero,index){
                        var body = layer.getChildFrame("body", index);
                        var contentWindow = layero.find('iframe')[0].contentWindow;//得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                        // body.find("label[name=user_id]").innerText(data.user_id);
                        body.find("input[name=job_title_id]").val(data.job_title_id);
                        body.find("input[name=job_title_name]").val(data.job_title_name);
                        body.find("input[name=dept_name]").val(data.dept_name);
                        body.find("textarea[name=description]").val(data.description);
                        body.find("textarea[name=remark]").val(data.remark);
                        body.find("input[name=status][value="+data.status+"]").attr("checked","checked");
                        contentWindow.layui.form.render();
                    },
                    yes:function (index, layero){
                        window.location.reload();
                    }
                })
            }
        });

        //监听头工具栏
        table.on('toolbar(LAY-user-manage)',function (obj){
            var checkStatus = table.checkStatus(obj.config.id);
            console.log(checkStatus)
            if(obj.event=='add_house'){
                layer.open({
                    type:2,
                    title:"新增职称信息",
                    content:'professional/add.html',
                    area:['650px','600px'],
                    maxmin:true,
                    btn:['确定','取消'],
                    yes:function (index, layero){
                        //获取edit.html-父list.html子edit.html-form表单
                        var body = layer.getChildFrame('body',index);
                        //获取表单的所有数据
                        var submitData = body.find('#myform').serialize();
                        console.log(submitData);
                        //发起Ajax异步请求
                        //http://localhost:8080/system/addJobtitle
                        $.ajax({
                            url:"/system/addJobtitle",
                            type:"post",
                            data:submitData,
                            dataType: "json",
                            success:function (res){
                                console.log(res)
                                if(res.code==200){
                                    layer.msg(res.msg,{
                                        offset:"15px",
                                        icon:1,
                                        time:1000
                                    },function (){
                                        //刷新
                                        window.location.reload();
                                    })
                                }
                                if(res.code==500){
                                    layer.msg(res.msg,{
                                        offset:"15px",
                                        icon:1,
                                        time:1000
                                    },function (){
                                        //刷新
                                        window.location.reload();
                                    })
                                }
                                //关闭弹层
                                layer.close(index);
                            }
                        })
                    }
                    ,//做页面框值回显
                    success:function (layero, index){
                        //渲染/刷新——一定加！！！！
                    }
                })

            }

        })




    });
</script>

</body>
</html>

